<script setup lang='ts'>
defineProps({
  name: {
    type: String,
    required: true,
    default: ''
  },
  icon: {
    type: String,
    default: 'map'
  },
  color: {
    type: String,
    default: 'error'
  }
})

</script>
<template>
  <view class="journal-local__warpper mtb-20">
    <uv-icon :color="color" :name="icon"></uv-icon>
    <text class="name">{{ name }}</text>
  </view>
</template>

<style scoped lang='scss'>
@import "@/styles/mixin/index.scss";

.journal-local__warpper {
  display: flex;
  align-items: center;
  font-size: var(--fl-font-size-small);

  .name {
    margin-left: 10rpx;
    color: #333;
    @include textEllipsis;
  }
}
</style>